// 何达燊-尾插法插入节点    写的是插入节点

var btn3 = document.querySelector('.btn3');
var svg = document.querySelector('svg');
let nodeArray = document.querySelectorAll('.node');

var x = 660;
var y = 0;
var tx = 698;
var ty = 56;

// 注册事件
btn3.onclick = () => {
  let nodeArray = document.querySelectorAll('.node');

  var g = document.createElementNS("http://www.w3.org/2000/svg", 'g');

  g.setAttribute('class', 'node');

  svg.appendChild(g);

  var use = document.createElementNS("http://www.w3.org/2000/svg", 'use');
  var len = nodeArray.length - 1;
  nodeArray[len].firstElementChild.setAttribute('href', '#temp');   // 修改tail位置
  use.setAttribute('href', '#tail');
  use.setAttribute('x', x);
  use.setAttribute('y', y);

  // 改变位置
  if (x <= 700) {
    x += 110;
  }
  else {
    y += 100;
    x = 0;
  }

  g.appendChild(use);

  // nodeArray.push();

  var txt = document.createElementNS("http://www.w3.org/2000/svg", 'text');

  let num = Math.round(Math.random() * 100) + 1;

  txt.setAttribute('x', tx);
  txt.setAttribute('y', ty);
  txt.setAttribute('class', 'fontstyle');
  txt.innerHTML = num;
  // 改变位置
  if (tx <= 800) {
    tx += 110;
  }
  else {
    ty += 100;
    tx = 38;
  }

  g.appendChild(txt);

}
  // 何达燊-end
